article, aside, details, figcaption, figure, footer, header, hgroup, nav, section {display: block; }
html, body, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, form, fieldset, legend, input, label, textarea, p, blockquote, th, td, figure, menu, pre { margin: 0; padding: 0; }
body {font: 400 12px/1.5 tahoma, arial, microsoft yahei; color: #444; -webkit-font-smoothing: antialiased; }
em, i { font-style: normal; }
h1, h2, h3, h4, h5, h6 { font-weight: 300; }
h1 {font-size: 1.5em; }
h2 { font-size: 1.3em; }
h3 { font-size: 1.2em; }
label, input, select {vertical-align: baseline; }
style, code, pre {font: 13px/22px 'Consolas','Microsoft Yahei'; }
table {border-spacing: 0;border-collapse: collapse; }
a { text-decoration: none; color: #444;}
a:hover { color: #666; }
img, button {background: #ddd; border: 0 none; vertical-align: middle; }
ul, nav, menu {list-style: none; }
ol {margin-left: 30px; }
@font-face {
    font-family: DINEngschriftStd;
    src: url('font/DINEngschriftStd.eot?#iefix') format('embedded-opentype'),
         url('font/DINEngschriftStd.woff') format("woff"),
         url('font/DINEngschriftStd.ttf') format('truetype');
}
@font-face {
    font-family: DIN-Regular;
    src: url('font/DIN-Regular.eot?#iefix') format('embedded-opentype'),
         url('font/DIN-Regular.woff') format("woff"),
         url('font/DIN-Regular.ttf') format('truetype');
}
@font-face {
    font-family: DIN-Bold;
    src: url('font/DIN-Bold.eot?#iefix') format('embedded-opentype'),
         url('font/DIN-Bold.woff') format("woff"),
         url('font/DIN-Bold.ttf') format('truetype');
}
@font-face {
    font-family: HelveticaNeueLTPro-Roman;
    src: url('font/HelveticaNeueLTPro-Roman.eot?#iefix') format('embedded-opentype'),
         url('font/HelveticaNeueLTPro-Roman.woff') format("woff"),
         url('font/HelveticaNeueLTPro-Roman.ttf') format('truetype');
}

@font-face {
    font-family: HelveticaNeueLTPro-UltLt;
    src: url('font/HelveticaNeueLTPro-UltLt.eot?#iefix') format('embedded-opentype'),
         url('font/HelveticaNeueLTPro-UltLt.woff') format("woff"),
         url('font/HelveticaNeueLTPro-UltLt.ttf') format('truetype');
}

.fl{float:left;}
.fr{float:right;}
.mt-10{margin-top: 10px;}
.mt-20{margin-top: 20px;}
.mb-20{margin-bottom: 20px;}
.mr-20{margin-right: 20px;}
.mt-30{margin-top: 30px;}
.mb-30{margin-bottom: 30px;}
.tc{text-align: center;}
.layout{max-width:1060px;margin: 0 auto;}
.clearfix{clear:both;}
.clearfix:after{content:'';display:block;height:0;clear:both;overflow: hidden;}
.more-btn{display:inline-block;padding: 0 25px;letter-spacing:4px;line-height: 36px; border: 1px solid #000;}

.links-item{display: inline-block; padding-top:37px; width: 37px; height: 0; background: url('images/bg.png') no-repeat; overflow: hidden;
    &.wb{padding-top: 21px; width: 24px;background-position: -79px -260px;}
    &.wx{padding-top: 21px; width: 25px;background-position: -154px -259px;}
    &.ft-wb{padding-top: 37px; width: 37px;background-position: -36px -211px;}
    &.ft-wx{padding-top: 37px; width: 37px;background-position: -110px -211px;}
    &.search{padding-top: 24px; width: 23px;background-position: -43px -257px;}
    &.reserve{padding-top: 38px; width: 33px;background-position: -153px -211px;}
    &.hd-logo{padding-top: 92px; width:147px;}
    &.ft-logo{padding-top: 119px; width:187px; background-position: 0 -92px;}
}


body{padding-top:50px;}
    .line{position: absolute; top: 38px; height:1px;overflow:hidden;background: #444; width:100px;}
    .slide .line{background:#fff;top:28px;}
#header{z-index:100; position: fixed; top: 0; left: 0; padding: 10px 0; width: 100%; height: 30px; background-color: #f0f0f0; overflow: hidden;
    li{.fl; padding: 0 14px; height: 30px; line-height: 28px;overflow:hidden;
        a{display:block;}
    }
    nav li.crt{
        a{border-bottom: 1px solid #444;}
    }

}

#header.index-header{position: fixed !important; background:transparent;
    a{ color:#fff;}
    nav li.crt a{border-bottom: 1px solid #fff;}
    .line{border-bottom: 1px solid #fff;}
    .links{display:none;}
}

.welcome{margin: 0 auto 35px; padding: 50px 200px; line-height: 28px; border-bottom: 10px solid #000;
    h2{margin-bottom: 50px; text-align: center; font:300 70px DINEngschriftStd; letter-spacing: 7px;
        span{display: inline-block; padding: 20px 0; border-bottom: 1px solid #444;}
    }
}
.module{overflow: hidden;
    .text{overflow: hidden; line-height: 28px;}
    h2{padding-bottom:20px;margin-bottom:20px;border-bottom:1px solid #333;
        strong{display: block; font: 100 100px/170px 'HelveticaNeueLTPro-UltLt'; height: 130px; overflow: hidden;}
        span{font-size: 18px; font-weight: 600;font-family: DIN-Regular;}
    }
    p{padding: 0 35px; font-size: 14px;font-family: DIN-Regular;}
    .more-btn{margin-left:35px;}
    &-right .text{padding-left:50px;}
    &-left .text{padding-right:50px;}
}
.arrive,.interest,.mode{margin-bottom: 120px;
    h2{margin:100px 0 50px; border-top: 1px solid #333; text-align: center; font-size: 14px;
        span{position:relative;top:-19px;display:inline-block;border:1px solid #333;font-family:DIN-Regular;line-height: 36px;width: 190px;background-color:#fff;}
    }
}

.arrive{
    .info, .location{width: 52%;line-height: 28px;
        h3{margin-bottom: 20px;font-size: 20px; font-weight: 700;}
    }
    .info{ position: relative; width: 40%;
        img{position: absolute; right:0; top: 50px;}
    }
}
.interest{
    &-list{overflow: hidden;
        li{.fl; margin-right: 5%; width: 30%; min-width: 10rem; line-height: 32px;
            &:nth-of-type(3n+0){margin-right:0;}
        }
        strong{display: block; margin-top: 10px; font-size: 16px; font-weight:400;font-family: DIN-Regular;}
        span{color: #888;}
        img{width:100%;}
    }
}
.contact-main, .location-main{margin: 40px 0; line-height: 28px; color: #000;
    .contact{width:50%;}
    .follow{width:50%; line-height: 34px;}
    h3{font-size: 22px; .mb-30;}
}

.mode{margin-bottom:40px;
    dl{margin-bottom: 60px; width: 40%;}
    dt{.mb-20; font-weight: 700;}
    &-box{width:50%;}
}

.title{margin: 70px 0; text-align:center; font-size: 40px; font-family: DIN-Regular, sans-serif, microsoft yahei; letter-spacing: 3px;
    span{font-size:26px;margin-left: 10px; font-weight: 400;}
}
.masonry-list{overflow: hidden;
    li{.fl; width: 30%; margin:0 1.5% 40px 1.5%;}
    img, strong, span{display: block;}
    strong{margin: 20px 0; font-size: 16px;font-weight: 400; font-family: DIN-Regular;}
    img{width:100%;}
    span{color:#999;}
}




#footer{padding: 70px 0 50px; text-align: center; color: #6e6e6e; background: #f1f1f1;
    .ft-logo{margin: 60px 0 40px;}
    .links{margin-bottom: 40px;
        a{margin: 0 10px;}
    }
    li{display: inline-block; padding: 0 15px;}
    a{color: #6e6e6e;
        &:hover{color: #5e5e5e;}
    }
}

.contact-banner{height: 525px; background: url('../img/banner/contact.jpg') no-repeat center center;}
.location-banner{height: 525px; background: url('../img/banner/location.jpg') no-repeat center center;}
.no1-banner{height: 525px; background: url('../img/banner/no.1.jpg') no-repeat center center;}
.no3-banner{height: 525px; background: url('../img/banner/no.3.jpg') no-repeat center center;}
.no5-banner{height: 525px; background: url('../img/banner/no.5.jpg') no-repeat center center;}
.activity-1-banner{height: 525px; background: url('../img/banner/Activity_1.jpg') no-repeat center center;}
.reco-1-banner{height: 525px; background: url('../img/banner/Reco_1.jpg') no-repeat center center;}
.dining-1-banner{height: 525px; background: url('../img/banner/Dining_1.jpg') no-repeat center center;}
.event-1-banner{height: 525px; background: url('../img/banner/Event_1.jpg') no-repeat center center;}
.event-2-banner{height: 525px; background: url('../img/banner/Event_2.jpg') no-repeat center center;}




.details{font-size:14px;line-height: 28px;}



@media screen and (max-width: 900px) {
    body{padding-top:84px;}
    #header{height: auto;}
    .slide nav{display: none;}
    .layout{width:100% !important;}
    .links{display: none;}
    .welcome{padding:0 20px 20px;}
    .module{
        h2{margin: 0 10px 10px; padding:0;}
        h2 strong, h2 span{font: 100 24px/1.5 DIN-Regular;}
        h2 strong{float:left; margin-right: 10px; font-size: 46px;}
        h2 span{margin-top: 16px;}
        p{padding: 0 15px;}
        .more-btn{margin: 10px 0 0 15px;}
        .text{padding:0 0 40px; width: 100%;}
        img{width:100%;height: auto;}
    }
    .arrive, .interest {margin-bottom:50px;}
    .interest h2,.arrive h2{margin: 50px 0 0;}
    .arrive .info, .arrive .location{float:none; width:auto; padding:0 20px;}
    .arrive .info{margin-bottom: 30px;}

    .contact-banner, .location-banner,.no1-banner{height:180px;background-size:100%;
    
    }

    .contact-main h3, .location-main h3{padding-left: 20px;}
    .contact-main{
        .contact,.follow{float:none;padding: 0 20px;width:auto; margin-bottom:50px;}
    }
    .mode dl{padding: 0 20px;}

    .title{margin: 0 0 30px; font-size: 28px;}
    #footer{padding: 20px 0;
        ul{text-align: left;line-height: 24px;}
        .ft-logo{margin: 30px 0 20px;}
    }
    .mode dl,.mode-box{width:auto;float:none;}
    .mode-box{padding: 0 20px;margin-bottom: 40px;
        h3{padding: 0; margin-bottom:10px;}
    }
    .interest-list ul{display: flex;
        li{flex:1; min-width: auto;}
    }

    .details{ p{margin-left:0 !important; padding:0 20px; width: auto !important;}
        img{max-width:100%;}
    }
}


.slide,.slide li,.slide li img{width:100%;}
.slide{position:relative;margin:0 auto;overflow:hidden;white-space: nowrap;
    nav li{width:auto; padding: 0 14px; height: 30px; line-height: 28px;
        a{display: block;}
        &.crt a{border-bottom: 1px solid #fff;}
    }
}
.slide li{display: inline-block; position: relative;}
.slide a,.slide a:hover{color:#fff;}
.slide .text{position:absolute;left:10%;bottom:5%;font-size:24px;
    & strong{font:3rem DINEngschriftStd;}
}
.slide .slide_page{position:absolute;bottom:0;width:100%;padding:10px 0;text-align: center; font-size: 0;overflow: hidden;}
.slide .slide_page i{display:inline-block;cursor:pointer;margin:0 5px;padding-top:11px;width:11px;height:0;overflow:hidden;border-radius:5px;background:#fff;box-shadow:inset 1px 1px 2px rgba(0, 0, 0, .4)}
.slide .slide_page i.selected{background-color:#00adef;}

.link-img{background:#000; display: block; position: relative;
    &:hover{opacity: 0.8; transition: all .3s;}
}